<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
%>

<!DOCTYPE HTML>
<html>
	<head>
		<title></title>
		<meta http-equiv="pragma" content="no-cache" />
		<meta http-equiv="cache-control" content="no-cache"/>
		<meta http-equiv="expires" content="0" />
		
		<link rel="stylesheet" href="<%=path %>/scripts/zTree/css/zTreeStyle/zTreeStyle.css" type="text/css" />
		
		<script type="text/javascript" src="<%=path %>/scripts/jquery/jquery-1.8.2.min.js"></script>
		<script type="text/javascript" src="<%=path %>/scripts/jquery/jquery.json-2.2.min.js"></script>
		<script type="text/javascript" src="<%=path %>/scripts/zTree/jquery.ztree.core-3.0.min.js"></script>
		<script type="text/javascript" src="<%=path %>/scripts/zTree/jquery.ztree.buttons.js"></script>
		<script type="text/javascript">
			$.ajaxSetup({cache:false,async:false});
			var setting = {
				data: {
					simpleData: {
						enable: true
					}
				},
				callback: {
					onClick:zTreeOnClick
				}
			};
			var dataMaker = function(){
				var nodes = [];
				$.getJSON("<%=path %>/menu/List",function(data){
					if(data != null){
						$.each(data,function(i,item){
							var h = {id:item.id,pId:item.parentId,name:item.menuName,code:item.parentid,open:true};
							nodes.push(h);
						});
					}
				});
				return nodes;
			};
			var zNodes = dataMaker();
			function zTreeOnClick(event, treeId, treeNode) {
				if(!treeNode.isParent){
					var state = true;
					var multiple = $("#defaultMultiple");
					$.each(multiple.get(0).options,function(i,o){
						if(treeNode.id == o.value){
							state = false;
						}
					});
					if(state){
						var pNode = treeNode.getParentNode();
						multiple.get(0).options.add(new Option("["+pNode.name+"]"+treeNode.name+"", ""+treeNode.id+""));
					}
				}
			}
			$(function(){
				$.fn.zTree.init($("#menuTree"), setting, zNodes);
				var opts = {
					relation:"relationMenu",
					code:"defaultMenu",
					name:"parentMenu",
					multiple:"defaultMultiple",
					submitBtn:"btnSubmit",
					removeBtn:"btnRemove",
					closeBtn:"btnClose"
				};
				closeClick(opts);
				removeClick(opts);
				submitClick(opts);
				loadMultiple(opts);
			});
		</script>
	</head>

	<body>
		<div class="left_sel">
			<div class="treebar">菜单选择项</div>
			<div class="content_wrap">
				<ul id="menuTree" class="ztree"></ul>
			</div>
		</div>
		<div class="operation">
			<div class="treebar">操作</div>
			<div class="win_btn" id="btnRemove">移 除</div>
			<div class="win_btn" id="btnSubmit">确 定</div>
			<div class="win_btn" id="btnClose">关 闭</div>
		</div>
		<div class="right_sel">
			<div class="treebar">已选项</div>
			<select multiple="multiple" id="defaultMultiple" class="select_multiple"></select>
		</div>
	</body>
</html>
